<template>
	<view class="page">
		<view class="plateN" v-for="(item,i) in list" :key="i" @click='changeCar(item,i)'>

			<view class="" style="display: flex;">
				<view class="bg-purple" style="background-color: #fe8a85;">
					<img src="/static/jeesite/tabbar/che.png" class='bg-purple-i' alt="" srcset="">
				</view>
				<view class="bg-purple-light">
					<view class="" style="font-weight: bold;">
						{{item.companyName}}
					</view>
					
				</view>
			</view>
			<view class="plateN-r">
				<img v-if="current == i" src="/static/jeesite/tabbar/xuanzhong.png" class='bg-purple-ii' alt=""
					srcset="">
				<img v-if="current != i" src="/static/jeesite/tabbar/jiaohuan.png" class='bg-purple-ii' alt="" srcset=""
					>
			</view>
		</view>
	</view>

</template>

<script>
	import store from '@/store/index.js';
	export default {
		data() {
			return {
				current: 0,
				list: [],


			}
		},
		onLoad() {
			var that = this
			
             	
			that.list = uni.getStorageSync('companyList')
			console.log(store.state.userList )
			console.log(uni.getStorageSync('companyList'))
			that.list.forEach((i, it) => {
				i.chack = false
				if (i.companyCode == store.state.userList.companyCode) {
					i.chack = true
					that.current = it
				}
			})

		},

		methods: {
			//交换
			changeCar(it, i) {
				this.current = i
				uni.removeStorageSync('changeUser');
				uni.setStorageSync('changeUser', it);
				this.$store.commit("changeUser", it)
			},
		},


	}
</script>

<style lang="scss" scoped>
	.bg-purple-ii {
		width: 50rpx;
		height: 50rpx;
		margin: 40rpx 10rpx 0 10rpx;

	}

	.page {
		// height: 100%;
		padding: 20rpx 20rpx;
		box-sizing: border-box;
		position: relative;
	}

	.plateN {
		height: 140rpx;
		line-height: 50rpx;
		box-shadow: 4px 4px 4px #f5f5f5;
		padding: 0 10rpx 0 0;
		box-sizing: border-box;
		margin-bottom: 50rpx;
		display: flex;
		justify-content: space-between;

		.bg-purple {

			width: 70rpx;
			height: 70rpx;
			background: #6e8ef0;
			border-radius: 4px;
			margin: 35rpx 0 0 35rpx;

			.bg-purple-i {
				width: 60%;
				height: 60%;
				margin-left: 50%;
				margin-top: 50%;
				transform: translate(-50%, -50%);
			}

		}

		.bg-purple-light {
			color: #6d6d6d;
			margin: 40rpx 0 0 30rpx;

		}

		.bg-purple-dark {
			width: 76rpx;
			height: 76rpx;

			.bg-purple-dark-i {
				width: 60%;
				height: 60%;
				margin-left: 50%;
				margin-top: 50%;
				transform: translate(-50%, -50%);
			}
		}
	}

	.plateN-r {}
</style>
